<template>
	<view>
		<camera device-position="front" flash="off" class="camera" @error="error" v-if="showCamera"></camera>
		<image mode="widthFix" class="image" :src="photoPath" v-if="showImage"></image>
		<view class="operate-container">
			<button type="primary" class="btn" @tap="clickBtn" :disabled="!canCheckin">{{ btnText }}</button>
			<button type="warn" class="btn" @tap="afresh" :disabled="!canCheckin">重拍</button>
		</view>
		<view class="notice-container">
			<text class="notice">注意事项</text>
			<text class="desc">拍照签到的时候，必须要拍摄自己的正面照片，侧面照片会导致无法识别。另外，拍照的时候不要戴墨镜或者帽子，避免影响拍照签到的准确度。</text>
		</view>
	</view>
</template>

<script>
// 引入SDK核心类
var QQMapWX = require('../../lib/qqmap-wx-jssdk.min.js');
var qqmapsdk;

export default {
	data() {
		return {
			showCamera: true,
			showImage: false,
			btnText: '拍照',
			photoPath: '',
			canCheckin: true,
			photoPath: ''
		};
	},
	onLoad: function() {
		qqmapsdk = new QQMapWX({
			key: 'T2NBZ-OY36F-HSBJT-JILGR-KNCV5-PIFEB' // 必填
		});
	},
	onShow:function(){
				let that=this
				that.ajax(that.url.validCanCheckIn,"GET",{},function(resp){
				
					let msg=resp.data.msg
					if(msg!="可以考勤"){
						that.canCheckin=false
						setTimeout(function(){
							uni.showToast({
								title:msg,
								icon:"none"
							})
						},1000)
					}
				})
			},
	methods: {
		clickBtn() {
			let that = this;
			if (that.btnText == '拍照') {
				let ctx = uni.createCameraContext();
				ctx.takePhoto({
					quality: 'high',
					success: function(resp) {
						that.photoPath = resp.tempImagePath;
						that.showCamera = false;
						that.showImage = true;
						that.btnText = '签到';
					}
				});
			} else {
				//签到
				uni.showLoading({
					title: '签到中请稍后'
				});
				setTimeout(function() {
					uni.hideLoading();
				}, 10000);

				uni.getLocation({
					type: 'wgs84',
					success: function(resp) {
						let latitude = resp.latitude;
						let longitude = resp.longitude;
						qqmapsdk.reverseGeocoder({
							location: {
								latitude: latitude,
								longitude: longitude
							},
							success: function(resp) {
								let address = resp.result.address;
								let addressComponent = resp.result.address_component;
								let nation = addressComponent.nation;
								let province = addressComponent.province;
								let city = addressComponent.city;
								let district = addressComponent.district;
								uni.uploadFile({
									url: that.url.checkin,
									filePath: that.photoPath,
									name: "photo",
									header: {
										token: uni.getStorageSync('token')
									},
									formData: {
										address: address,
										country: nation,
										province: province,
										city: city,
										district: district
									},
									success: function(resp) {
										console.log(resp)

										if(resp.statusCode===500){
											uni.hideLoading();
											uni.showToast({
												icon:"none",
												title:resp.data
											})
										}else if (resp.statusCode===200){
											uni.hideLoading();
											uni.showToast({
												title: '签到成功',
												complete: function() {
													uni.navigateTo({
														url: '../checkin_result/checkin_result'
													});
												}
											});
											}
									}
								});
							}
						});
					},
					fail: function(e) {
						console.log(e);
					}
				});
			}
		},
		afresh() {
			let that = this;
			that.showCamera = true;
			that.showImage = false;
			that.btnText = '拍照';
		}
	}
};
</script>

<style lang="less">
@import url('checkin.less');
</style>
